<template>
  <div class="mainos">
    <div class="main_spac1 paddingBottom5">
      <div class="main_white padding10 paddingBottom20">
        <div class="main_crumbs boxdq">
          <div class="main_crumbs_l">
            <a href="javascript:;" @click="$router.back(-1)">
              <i class="el-icon-arrow-down"></i>返回
            </a>
            <em>|</em>
            <span>调拨详情</span>
          </div>
        </div>
        <div>
          <div class="main_tile boxdq marginTop10">
            <div class="main_tile_l marginLeft0"><em></em>调拨详情</div>
          </div>
          <div class="main_xq">
            <ul class="boxha">
              <li v-for="item in detailList" :key="item.label">
                {{ item.label }}：<span>{{ detailInfo[item.value] }}</span>
              </li>
              <li class="main_w100">
                备注：<span>{{ detailInfo.remark }}</span>
              </li>
            </ul>
          </div>
          <div class="main_tile boxdq marginTop10">
            <div class="main_tile_l marginLeft0"><em></em>子料详情</div>
          </div>
          <MainTable
            ref="detailTable"
            :loading="listLoading"
            :columns="detailColumns"
            :tableData="tableData"
            show-summary
            :summary-method="getSummaries"
          >
          </MainTable>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { allocationInfo } from "@/api/warehouse/warehouseLoss";
import { apiUrl, objKeySort, Md5 } from "@/utils/public";
import { parseTime } from "@/utils/index";
import { allocationDetail } from './mockData'
const { detailColumns, detailList } = allocationDetail

export default {
  components: {},
  data() {
    return {
      // 时间
      parseTime,
      listLoading: false,
      // id
      id: this.$route.params.id,
      detailList,
      detailColumns,
      detailInfo: {},
      tableData: []
    };
  },
  created() {
    // 基本信息
    this.getData();
  },
  methods: {
    // 基本信息
    getData() {
      this.listLoading = true
      let data = Object.assign(
        {
          sign: Md5(
            objKeySort(Object.assign(apiUrl().name, { id: this.id })) +
              apiUrl().appsecret
          ),
        },
        apiUrl().name,
        { id: this.id }
      );
      allocationInfo(data).then((res) => {
        if (res.errcode == 0) {
          this.listLoading = false
          this.detailInfo = res.data
          this.tableData = res.data.list_goods
        } else {
          this.$message.error(res.errmsg);
        }
      });
    },
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        switch (index) {
          case 0:
            sums[index] = "合计";
            break;
          case 5:
            sums[index] = this.$toFixed(parseFloat(this.detailInfo.total_money));
            break;
        }
      });
      return sums;
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/styles/variables.scss";

.mainos {
  .main_tile {
    .mainos_tile_r {
      color: $colour_red;
      font-size: $font_14;
    }
  }
  .mainor_ex {
    position: fixed;
    width: 220px;
    height: 100%;
    background: $white;
    box-shadow: 0 6px 10px rgba(0, 21, 41, 0.08);
    top: 0;
    right: 0;
    z-index: 9999;
    transition: all 0.5s;
    transform: translate3d(100%, 0, 0);
    &.on {
      transform: translate3d(0, 0, 0);
    }
  }
}
</style>
